﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="tolc.aspx.cs" Inherits="ZF.WS.test.tolc" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <% %>
    <title>在线咨询</title>
    <link href="/css/common.css" rel="stylesheet" type="text/css" />
    <link href="/css/default.css" rel="stylesheet" type="text/css" />
    <link href="/css/default.css" rel="stylesheet" type="text/css" />

    <script src="/js/jQuery.js" type="text/javascript"></script>

    <script src="js/jquery-1.4.2.js" type="text/javascript"></script>

    <script src="/js/calendar.js" type="text/javascript"></script>

    <script src="/js/index.js" type="text/javascript"></script>

    <script src="/js/jqPlugins/jquery.json-2.2.min.js" type="text/javascript"></script>

    <script src="/js/char.js" type="text/javascript"></script>
<link href="/css/char.css" rel="stylesheet" type="text/css" />
    <style>
        .peopleList { width: 160px; height: 494px; }
        .peopleList a { display: block; line-height: 30px; height: 30px; text-align: center; font-size: 14px; border: 1px solid #eee; margin: 3px; }
        .peopleList a:hover { background: #E5F2FB; }
        .peopleList dd.active a { background: #0099FF; }
        .divTk { width: 500px; height: 164px; }
    </style>
    
</head>
<body>
    <form id="form1" runat="server">

    <script>
 
        var osguid = null;
        var asmxPage = "/WSChat.asmx"
    </script>


    <link href="/fckeditor/_samples/sample.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" src="/fckeditor/fckeditor.js"></script>

    <style>
        #br { height: 330px; margin-bottom: 5px; background: #fafafa; border: 1px solid #BCDDF4; overflow: scroll; }
        #br dl { margin-bottom: 5px; border-bottom: 1px solid #eee; margin-left: 5px; }
        #br dl dt { text-align: left; }
        #br dl dt.dt1 { color: #008040; }
        #br dl dt.dt2 { color: #44B8FB; }
        #br dl dd { margin-left: 10px; margin-top: 5px; text-align: left; }
        #br dl dd img { margin: 1px; }
        #br dl dd.sys { color: #f00; font-size: 14px; }
    </style>
    <table class="w100_">
        <tr>
            <td>
            <div class="w100_">
                <div class="board conntil <%=Request.Url.ToString().IndexOf("tolc.aspx?")!=-1?"":"dn_" %>">
                    <dl>
                        <dt><span>正在与<%=this.Expert.Account %>进行在线交流</span></dt></dl>
                </div>
                <div id="br">
                </div>

                <script type="text/javascript">
         var sBasePath = "/fckeditor/"
         var oFCKeditor = new FCKeditor('FCKeditor1');
         oFCKeditor.BasePath = sBasePath;
         oFCKeditor.ToolbarSet = 'Chat';
         oFCKeditor.Value = '';
         oFCKeditor.Height ="100px"
         oFCKeditor.Create();
         var memberId=<%=this.CurrentUser.MemberId %>;
         var expert="<%=this.Expert.Account %>";
         var inteset=<%=this.InteSet %>;
                </script>
</div>
            </td>
             
        </tr>
    </table>
    
    
    <script>

        function _keep() {
            ajax(String.format("{memberId:{0}}", memberId), "Keep", null);
        }
        $(function() {
            window.resizeTo(900, 650);
            _keep();
            setInterval("_keep()", 1000 * 30);
            initEvent();

            setInterval("__rec()", 1000);
            $(window).unload(function() {
                ajax($.toJSON({ memberId: memberId, roomKey: RoomKey }), "Out", null);
            });
        });
    </script>
    <script type="text/javascript">
    
        var RoomKey = "<%=this.RoomKey %>";
        var editor = null;

        function initEvent() {
            $("#stop").click(function() {
                _stop();
            });
        }
        function gettime() {
            var today = new Date();
            var h = today.getHours();
            var m = today.getMinutes();
            var s = today.getSeconds();
            return String.format("{0}:{1}:{2}", h, m, s);
        }
        function __send(msg) {
            var data = { memberId: memberId, msg: msg, roomKey: RoomKey };
            ajax($.toJSON(data), "Send", function(msg) {
                msg = $.evalJSON(msg).d;
                if (msg != null) {
                    if (msg.IType == 1) {
                        $("#br").append(String.format("<dl><dt class='dt1'>{1}&nbsp;&nbsp;&nbsp;&nbsp;{2}</dt><dd>{0}</dd></dl>",
                         msg.Msg, msg.FromMember, gettime()));
                    } else {
                        if (msg.IType == 10 || msg.IType == 11 || msg.IType == 20 || msg.IType == 21) {
                            $(".conntil dt span").html(String.format("与{0}的会话已中断", expert));
                        }
                        $("#br").append(String.format("<dl><dd class='sys'>系统消息：{0}</dd></dl>",
                             msg.Msg, msg.FromMember, gettime()));
                    }
                    _setDivScrollTop();
                }
            });
        }
        function __rec() {
            ajax(String.format("{memberId:{0},roomKey:'{1}'}", memberId, RoomKey), "rec", function(msg) {
                var str = msg;
                var msg = $.evalJSON(msg).d;
                if (msg.length > 0) {
                    $(msg).each(function() {
                        if (this.IType == 1) {
                            $("#br").append(String.format("<dl><dt class='dt2'>{1}&nbsp;&nbsp;&nbsp;&nbsp;{2}</dt><dd>{0}</dd></dl>",
                             this.Msg, this.FromMember, gettime()));
                        } else {
                            if (this.IType == 10 || this.IType == 11 || this.IType == 20 || this.IType == 21) {
                                $(".conntil dt span").html(String.format("与{0}的会话已中断", expert));
                            }
                            if (this.IType == 50) {
                                var intr = _getInte();
                                _applyBack(confirm("对方请求与你进行计费通话.\r\n如果选择确定将每分钟扣除你" + intr
                                     + "个积分,选择取消则拒绝本次计费通话申请.\r\n请选择"));
                                return true;
                            } else if (this.IType == 53) {
                                $("#stop").hide();

                            } else if (this.IType == 54) {
                                $(".billingInfo").html(String.format("你还有{0}积分", this.Msg));
                                return true;
                            }
                            $("#br").append(String.format("<dl><dd class='sys'>系统消息：{0}</dd></dl>",
                             this.Msg, this.FromMember, gettime()));
                        }
                        _setDivScrollTop();
                    });
                    window.focus();
                }
            });
        }
        function _getInte() {
            var data = { roomKey: RoomKey};
            var result = 0;
            ajax($.toJSON(data), "GetInte", function(msg) { msg = $.evalJSON(msg); result = msg.d; });
            return result;
        }
        function _applyBack(result) {
            var data = { roomKey: RoomKey, result: result };
            ajax($.toJSON(data), "ApplyBack", null);
            if (result) {
                $("#stop").show();
            }
        }
        function _stop() {
            var data = { roomKey: RoomKey };
            ajax($.toJSON(data), "ApplyStop", null);
            $("#stop").hide();
        }
        function _setDivScrollTop() {
            $("#br")[0].scrollTop = $("#br")[0].scrollHeight;
        }
    </script>

    <div class="tar_ pr10_">
        <span class=" fl_"><span class=" fl_">
            <input type="radio" name="qjj" class="qjj" id="qjj1" checked="checked" /><label for="qjj1">Enter发送</label>
            <input type="radio" name="qjj" class="qjj" id="qjj2" /><label for="qjj2">Ctrl+S发送</label>
            <input type="radio" name="qjj" class="qjj" id="qjj3" /><label for="qjj3">Ctrl+Enter发送</label>
            &nbsp;&nbsp;&nbsp;
            <%if (this.Expert.ExpertType == 1 || this.Expert.ExpertType == 2)
              {%>
           <span class='billingInfo'>你还有<%= CurrentUser.Integral%>积分</span> 
            <input type="button" class="dn_ linkbtn" id="stop" value="停止计费通话"    />
            <%}%>
        </span></span><span class=" fr_">
            <input type="button" id="send" value=" 发 送 " class="linkbtn" />
            <input type="button" id="clear" value=" 清 空 " class="linkbtn" />&nbsp; </span>
    </div>
    </form>
</body>
</html>
